﻿#if($msg)
<script>
alert('$!msg');
</script>
#end
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>编辑字段</title>
<link href="/include/manage/images/main/style.css" rel="stylesheet" type="text/css" />
<link href="/include/manage/dialog/asyncbox.css" type="text/css" rel="stylesheet" />
<style type="text/css">
#control{
	border-top:1px solid white;
	border-left:1px solid white;
	border-right:1px solid gray;
	border-bottom:1px solid gray;
	background-color:#F1F1F1;
}
#FormData{margin:0px;}
#FormData td{background:white;height:20px;}
#FormData span{border-right:1px solid gray;border-bottom:1px solid gray;height:24px;overflow:hidden}
#FormData span a{line-height:100%;}
#FormData .order{width:32px;text-align:center}
#FormData .name{width:200px;}
#FormData .label{width:200px;}
#FormData .opt{}
</style>
<script language="javascript" src="/include/manage/js/jquery.js"></script>
<script language="javascript">
var totalnums=0;
var editnum=1;
var formFields=new Array();

$(function(){
	var str="$!form.content.replaceAll('\n','\\\\n').replaceAll('\r','')";
	if(str.length>0){
		var dataFields=str.split('|');
		totalnums=dataFields.length;
		var newnum=totalnums+1;
		$("#field_order")[0].innerHTML=newnum;
		editnum=newnum;
		var strhtml="";
		for(var i=0;i<dataFields.length;i++){
			var newField = eval('('+dataFields[i]+')');
			strhtml+="<tr id=\""+newField.order+"\"><td class='order'>"+newField.order+"</td><td class='name'>"+newField.name+"</td><td class='label'>"+newField.label+"</td><td class='opt'><a href=\"javascript:Edit('"+newField.order+"')\">修改</a> | <a href=\"javascript:Delete('"+newField.order+"')\">删除</a></td></tr>";
			//strhtml+="<li id=\""+newField.order+"\"><span class='order'>"+newField.order+"</span><span class='name'>"+newField.name+"</span><span class='label'>"+newField.label+"</span><span class='opt'><a href=\"javascript:Edit('"+newField.order+"')\">修改</a> | <a href=\"javascript:Delete('"+newField.order+"')\">删除</a></span></li>";
			var nf = new formField();
			nf.order=newField.order;
			nf.name=newField.name;
			nf.label=newField.label;
			nf.type=newField.type;
			nf.value=newField.value;
			nf.require=newField.require;
			if(formFields!=null){
				formFields.push(nf);
			}else{
				formFields=new Array(nf);
			}
		}
		$("#FormData").append(strhtml);
	}
});

function formField(){
	this.name="";
	this.label="";
	this.order="";
	this.type="";
	this.value="";
	this.require="";
};

function addNew(){
	$("#field_order")[0].innerHTML=totalnums+1;
	editnum=totalnums+1;
}

function saveEdit(){
	var editname=$("#fname").val();
	if(editname.length==0){
		alert('字段名称必填');
		$("#fname")[0].focus();
		return false;	
	}
	saveEditData();
}

function saveEditData(){
	if(editnum>0){
		var newField = new formField();
		newField.order=editnum;
		newField.name=$("#fname").val();
		newField.label=$("#flabel").val();
		newField.type=$("#ftype").val();
		newField.value=$("#fvalue").val();
		newField.require=$("input[name='frequire']:checked").val();
		var str="<tr id=\""+newField.order+"\"><td class='order'>"+newField.order+"</td><td class='name'>"+newField.name+"</td><td class='label'>"+newField.label+"</td><td class='opt'><a href=\"javascript:Edit('"+newField.order+"')\">修改</a> | <a href=\"javascript:Delete('"+newField.order+"')\">删除</a></td></tr>";
		//var str="<li id=\""+newField.order+"\"><span class='order'>"+newField.order+"</span><span class='name'>"+newField.name+"</span><span class='label'>"+newField.label+"</span><span class='opt'><a href=\"javascript:Edit('"+newField.order+"')\">修改</a> | <a href=\"javascript:Delete('"+newField.order+"')\">删除</a></span></li>";
		if(editnum<=totalnums){
			$("#"+editnum).replaceWith(str);
			formFields[editnum-1]=newField;
		}else{
			$("#FormData").append(str);
			//$("#FormData")[0].innerHTML+=str;
			if(formFields!=null){
				formFields.push(newField);
			}else{
				formFields=new Array(newField);
			}
			totalnums++;
		}
		var newnum=totalnums+1;
		$("#field_order")[0].innerHTML=newnum;
		editnum=newnum;
	}
}

function Edit(order){
	var newField = formFields[order-1];
	$("#field_order")[0].innerHTML=newField.order;
	editnum=newField.order;
	$("#fname").val(newField.name);
	$("#flabel").val(newField.label);
	$("#ftype").val(newField.type);
	$("#fvalue").val(newField.value);
	if(newField.require==1||newField.require=="1"){
		$("#f_require").attr("checked",true);
		$("#f_norequire").removeAttr("checked");
	}else{
		$("#f_norequire").attr("checked",true);
		$("#f_require").removeAttr("checked");
	}
}

function Delete(order){
	//delete formFields[order-1];
	Array_RemoveItem(formFields[order-1]);
	$("#"+order).remove();
}

function Array_RemoveItem(item){
	var tmpArray = new Array();
	for(var i = 0; i < formFields.length; i++){
		if(formFields[i] != item) tmpArray.push(formFields[i]);
	}
	formFields = tmpArray;
}

function createFormData(){
	var str="";
	if(formFields.length>0){
	for (var i=0;i<formFields.length;i++){
		var one = formFields[i];
		if(one!=null){
			str+="{name:'"+one.name+"',label:'"+one.label+"',order:'"+(i+1)+"',type:'"+one.type+"',value:'"+one.value+"',require:'"+one.require+"'}|";
		}
	}
	str=str.substring(0,str.length-1);
	}
	$("#form_content").val(str);
	$("#writeform")[0].submit();
}
</script>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td height="30" background="/include/manage/images/main/tab_05.gif"><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="12" height="30"><img src="/include/manage/images/main/tab_03.gif" width="12" height="30" /></td>
        <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="46%" valign="middle"><table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="5%"><div align="center"><img src="/include/manage/images/main/tb.gif" width="16" height="16" /></div></td>
                <td width="95%"><span class="STYLE3">当前位置</span>：[互动管理]-[编辑字段]</td>
              </tr>
            </table></td>
            <td width="54%"><table border="0" align="right" cellpadding="0" cellspacing="0">
              <tr>
                <td width="60"><table width="90%" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td><div align="center"><a href="/manage_form.ad?parameter=add"><img src="/include/manage/images/main/22.gif" width="14" height="14" /></a></div></td>
                    <td><div align="center"><a href="/manage_form.ad?parameter=add">新增</a></div></td>
                  </tr>
                </table></td>
                <td width="52"><table width="88%" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td><div align="center"><a href="/manage_form.ad?parameter=delete&id=$!form.id"><img src="/include/manage/images/main/11.gif" width="14" height="14" /></a></div></td>
                    <td><div align="center"><a href="/manage_form.ad?parameter=delete&id=$!$!form.id">删除</a></div></td>
                  </tr>
                </table></td>
              </tr>
            </table></td>
          </tr>
        </table></td>
        <td width="16"><img src="/include/manage/images/main/tab_07.gif" width="16" height="30" /></td>
      </tr>
    </table></td>
  </tr>
  <tr>
  	<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="8" background="/include/manage/images/main/tab_12.gif">&nbsp;</td>
        <td>
<table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#b5d6e6">
<form id="writeform" name="writeform" method="post" action="/manage_form.ad">
    <tr> 
      <td width="20%" height="25" bgcolor="#ffffff">&nbsp;表单名称：</td>
      <td bgcolor="#ffffff">&nbsp;
		<input type="hidden" name="parameter" value="$!action" />
		<input type="hidden" name="id" value="$!form.id" />
      	<input type="text" name="name" value="$!form.name" />
        <input type="hidden" id="form_content" name="content" value="$!form.content" />
      </td>
    </tr>
 </form>
    <tr>
    	<td height="25" colspan="2">
			<table width="100%" cellpadding="0" cellspacing="0" border="0">
            	<tr>
                <td valign="top" style="padding:1px">
                	<table id="FormDataAll" width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#b5d6e6">
                  	<tr>
                  		<td width="32" height="22" background="/include/manage/images/main/bg.gif"><div align="center">序号</div></td>
                      <td width="200" background="/include/manage/images/main/bg.gif"><div align="center">名称</div></td>
                      <td width="200" background="/include/manage/images/main/bg.gif"><div align="center">标签</div></td>
                      <td background="/include/manage/images/main/bg.gif"><div align="center">操作</div></td>
                     </tr>
										 <tbody id="FormData">
										 </tbody>
												<!--tr>
													<td colspan="4">
															<div style="width:100%;background:white"><ul id="FormData"></ul></div>
													</td>
												</tr-->
                    </table>
            	</td>
                <td width="260" style="padding:1px;padding-left:0px">
                	<div id="control">
                    	<form name="formControl">
                    	<h4>&nbsp;控制面板</h4>
                    	<ul style="margin:4px">
                        	<li>字段序号：<span id="field_order">1</span></li>
                        	<li>字段名称：<input type="text" id="fname" name="fname" value=""/></li>
                            <li>字段标签：<input type="text" id="flabel" name="flabel" value=""/></li>
                            <li>字段类型：
                            <select name="ftype" id="ftype">
                                <option value="text">普通文本</option>
                                <option value="radio">单选</option>
                                <option value="checkbox">复选</option>
                                <option value="select">下拉列表</option>
                                <option value="file">文件上传</option>
								<option value="pic">配图(长*宽)</option>
								<option value="textarea">文本区域</option>
                                <option value="html">富文本</option>
                            </select>
                            </li>
                            <li>初 始 值：(一行一个选项)<textarea id="fvalue" name="fvalue"></textarea></li>
                            <li>是否必填：<input id="f_norequire" type="radio" name="frequire" value="0" checked/>否<input id="f_require" type="radio" name="frequire" value="1"/>是</li>
                            <li><input name="reset" type="reset" onClick="saveEdit()" value="保存并新增"/></li>
                        </ul>
                        </form>
                    </div>
                </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
		</td>
        <td width="8" background="/include/manage/images/main/tab_15.gif">&nbsp;</td>
      </tr>
    </table></td>
    </tr>
  <tr>
    <td height="35" background="/include/manage/images/main/tab_19.gif"><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="12" height="35"><img src="/include/manage/images/main/tab_18.gif" width="12" height="35" /></td>
        <td valign="top"><div align="center"> 
          <input type="button" name="Submit" value="保存" onClick="createFormData()" />
          &nbsp; &nbsp; 
          <input type="button" name="Reset" value="重写" />
        </div></td>
        <td width="16"><img src="/include/manage/images/main/tab_20.gif" width="16" height="35" /></td>
      </tr>
    </table>
	</td>
  </tr>
</table>
</body>
</html>